<template>
  <div style="min-width:1366px;">
    <!-- 搜索栏区域 -->
    <el-card class="SearchCard" body-style="padding:0px">
      <el-row>
        <el-col :span="2">
          <div class="SearchTitle">条件搜索栏</div>
        </el-col>
        <el-col :span="4">
          <el-row>
            <el-col :span="10">
              <div class="SearchLable">搜索关键字</div>
            </el-col>

            <el-col :span="14">
              <div class="SearchLable">
                <el-input placeholder="请输入内容" v-model="queryInfo.srm" clearable @clear="clearEvent"></el-input>
              </div>
            </el-col>
          </el-row>
        </el-col>
        <el-col :span="2">
          <div class="SearchLable">
            <el-button size="medium" type="primary" @click="getSearchList()">搜索</el-button>
          </div>
        </el-col>
      </el-row>
    </el-card>
    <el-card class="TableCard" :body-style="{ padding: '0px' }">
      <div>
        <el-table
          :data="tableData"
          border
          height="550"
          :header-cell-style="{ 'text-align':'center',background: '#3F9DFD', color: '#FFF' }"
          :cell-style="{'text-align':'center'}"
          size="medium"
          stripe
          style="width: 100%;font-size:12px"
        >
          <el-table-column prop="ysdm" label="医院医生代码" width="100"></el-table-column>
          <!-- <el-table-column prop="name"
                           label="操作"
                           width="60">
            <el-button type="text"
                       size="mini"
                       @click="dialogVisible = true">编辑</el-button>
          </el-table-column>-->
          <el-table-column prop="ysmc" label="医院医生名称"></el-table-column>

          <el-table-column prop="ksdm" label="所属科室代码"></el-table-column>
          <el-table-column prop="ksmc" label="所属科室名称"></el-table-column>
          <el-table-column label="医师级别">
            <template slot-scope="scope">
              <el-select
                v-model="scope.row.ysjb"
                @change="changeysjb(scope.row.id, $event)"
                size="small"
              >
                <el-option
                  v-for="item in ysjbData"
                  :key="item.value"
                  :label="item.label"
                  :value="item.value"
                ></el-option>
              </el-select>
            </template>
          </el-table-column>
          <el-table-column label="是否有处方权">
            <template slot-scope="scope">
              <el-select
                v-model="scope.row.cfq"
                @change="changecfq(scope.row.id, $event)"
                size="small"
              >
                <el-option
                  v-for="item in cfqData"
                  :key="item.value"
                  :label="item.label"
                  :value="item.value"
                ></el-option>
              </el-select>
            </template>
          </el-table-column>
          <el-table-column prop="sykjyjb" label="抗菌药用药级别">
            <template slot-scope="scope">
              <el-select
                v-model="scope.row.sykjyjb"
                @change="changesykjyjb(scope.row.id, $event)"
                size="small"
              >
                <el-option
                  v-for="item in sykjyjbData"
                  :key="item.value"
                  :label="item.label"
                  :value="item.value"
                ></el-option>
              </el-select>
            </template>
          </el-table-column>
          <el-table-column label="操作人员">
            <template slot-scope="scope">{{scope.row.matchUser}}</template>
          </el-table-column>
          <el-table-column label="操作时间">
            <template slot-scope="scope">{{getDate(scope.row.matchTime)}}</template>
          </el-table-column>
        </el-table>
      </div>
      <div class="block">
        <el-pagination
          @size-change="handleSizeChange"
          @current-change="handleCurrentChange"
          :current-page="queryInfo.pagenum"
          :page-sizes="[20, 50, 100]"
          :page-size="queryInfo.pageSize"
          layout="total, sizes, prev, pager, next, jumper"
          :total="this.total"
          background
        ></el-pagination>
      </div>
    </el-card>
  </div>
</template>
<script>
import {
  getDoctorDictList,
  getdate,
  EditDoctorYSJB,
  EditDoctorCFQ,
  EditDoctorKJYW
} from "@/api/rad";
export default {
  data() {
    return {
      queryInfo: {
        srm: "",
        page: 1,
        pageSize: 20
      },
      total: 0,
      tableData: [],
      dialogVisible: false,
      //   -1不确定，1临床医师，2主治医师，3副主任医师，4主任医师
      ysjbData: [
        {
          value: -1,
          label: "不确定"
        },
        {
          value: 0,
          label: "无"
        },
        {
          value: 1,
          label: "临床医师"
        },
        {
          value: 2,
          label: "主治医师"
        },
        {
          value: 3,
          label: "副主治医师"
        },
        {
          value: 4,
          label: "主任医师"
        }
      ],
      cfqData: [
        {
          value: -1,
          label: "不确定"
        },
        {
          value: 0,
          label: "无"
        },
        {
          value: 1,
          label: "是"
        },
        {
          value: 2,
          label: "否"
        }
      ],
      //   使用抗菌药级别 -1未维护，0不能使用，1非限制级别，2限制级别，3特殊级别
      sykjyjbData: [
        {
          value: -1,
          label: "未维护"
        },
        {
          value: 0,
          label: "不能使用"
        },
        {
          value: 1,
          label: "非限制级别"
        },
        {
          value: 2,
          label: "限制级别"
        },
        {
          value: 3,
          label: "特殊级别"
        }
      ]
    };
  },
  created: function() {
    this.getDoctorDictList();
  },
  methods: {
    handleClose(done) {
      done();
    },
    handleSizeChange(newSize) {
      this.queryInfo.pageSize = newSize;
      this.getDoctorDictList();
    },

    handleCurrentChange(newPage) {
      this.queryInfo.page = newPage;
      this.getDoctorDictList();
    },
    getDate(date) {
      return this.$rad.getdate(date);
    },
    async getDoctorDictList() {
      let res = await this.$rad.getDoctorDictList({
        srm: this.queryInfo.srm,
        page: this.queryInfo.page,
        pageSize: this.queryInfo.pageSize
      });
      (this.tableData = res.rows), (this.total = res.total);
      console.log(res.rows);
    },
    async changeysjb(TypeId, e) {
      console.log(TypeId);
      console.log(e);
      let res = await this.$rad.EditDoctorYSJB({
        id: TypeId,
        ysjb: e
      });
      if (res.code == 1) {
        this.getDoctorDictList();
        return this.$message({
          type: "success",
          message: res.msg
        });
      } else {
        return this.$message({
          type: "error",
          message: res.msg
        });
      }
      console.log(res);
    },
    async changecfq(TypeId, e) {
      console.log(TypeId);
      console.log(e);
      let res = await this.$rad.EditDoctorCFQ({
        id: TypeId,
        cfq: e
      });
      console.log(res);
      if (res.code == 1) {
        this.getDoctorDictList();
        return this.$message({
          type: "success",
          message: res.msg
        });
      } else {
        return this.$message({
          type: "error",
          message: res.msg
        });
      }
    },
    async changesykjyjb(TypeId, e) {
      console.log(TypeId);
      console.log(e);
      let res = await this.$rad.EditDoctorKJYW({
        id: TypeId,
        sykjyjb: e
      });
      console.log(res);
      if (res.code == 1) {
        this.getDoctorDictList();
        return this.$message({
          type: "success",
          message: res.msg
        });
      } else {
        return this.$message({
          type: "error",
          message: res.msg
        });
      }
    },
    getSearchList() {
      console.log(this.queryInfo);
      this.getDoctorDictList();
    },
    clearEvent() {}
  }
};
</script>
<style>
.SearchCard {
  height: 50px;
  font-size: 12px;
}
.SearchTitle {
  height: 50px;
  display: flex;
  justify-content: center;
  align-items: center;
  border-right: 1px solid #c2c2c2;
}
.SearchLable {
  height: 50px;
  display: flex;
  justify-content: center;
  align-items: center;
}
.TableCard {
  margin-left: 3px;
  margin-top: 2px;
}
.block {
  text-align: center;
  margin-top: 12px;
  margin-bottom: 12px;
}
</style>